<!doctype html>  
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ --> 
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9" manifest="offline.manifest"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js" manifest="offline.manifest"> <!--<![endif]-->
<head>
  <meta charset="utf-8">
 
  <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame 
       Remove this if you use the .htaccess -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  <title>Week Day Trainer</title>
  <meta name="description" content="Trainer for calculation of the day of the week.">
  <meta name="author" content="Marco Stahl">

  <!--  Mobile viewport optimized: j.mp/bplateviewport -->
  <meta name="viewport" content="width=device-width; initial-scale=1.0">

  <!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
  <link rel="shortcut icon" href="favicon.ico">
  <link rel="apple-touch-icon" href="apple-touch-icon.png">

  <!-- CSS : implied media="all" -->
  <link rel="stylesheet" href="css/style.css">

  <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
  <script src="js/modernizr.min.js"></script>

</head>

<body>

  <div id="container">
    <header>
      <h1>Week Day Trainer</h1>
    </header>
    
    <div id="main">      
      
      <div id="gameSettings">
        <div class="formRow">
          <label>Range Of Years:</label>      
          <div>    
            <input id="2010_2011" type="radio" name="range" value="2010-2011" checked="checked"/> <label class="radioLabel" for="2010_2011">2010-2011</label>
            <input id="1800_2099" type="radio" name="range" value="1800-2099"/> <label class="radioLabel" for="1800_2099">1800-2099</label>
          </div>
        </div>
        <div class="formRow">
          <label for="rounds">Rounds:</label>
          <input type="text" id="rounds" name="rounds" value="5" size="4"/><br/>
        </div>
        <button id="startButton">Start</button><br/>
        <a id="statisticsLink" href="#">Statistics</a>         
      </div>
      
      <div id="game" style="display:none;">
        <div id="question" ></div>
        
        <div id="answerButtons">
            
        </div>
        <div id="currentRoundLabel">1 / 3</div>
        <button id="quitButton">Quit</button>
      </div>
      
      <div id="statistics" style="display:none;">
        <h2>Statistics</h2>
        <div id="statsAvailable">
          <table id="statisticsTable" style="display:none">
            <tr>
              <th>Date</th>
              <th>Result</th>
              <th>Errors</th>
            </tr>          
          </table>
          <div id="chart" style="width:400px;height:300px;"></div>
          <button id="clearStatsButton">Clear Statistics</button>
        </div>
        <div id="noStatsAvailable">
            No Stats available.
        </div>
      </div>
      
    </div>
    <footer>

    </footer>
  </div> <!--! end of #container -->

  <script>
    if (Modernizr.applicationcache) {
      document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"><\/script>');
    } else {
      document.write('<script src="js/gears_init.min.js"><\/script>');
    }
  </script>
  <script>!window.jQuery && document.write('<script src="js/jquery.min.js"><\/script>')</script>
 
   <!--[if lt IE 9 ]>
    <script src="js/flot/excanvas.min.js"></script>
  <![endif]-->
 
  <script src="js/script.min.js"></script>

</body>
</html>